{#
 # ---------------------------------------------------------------------
 #
 # GLPI - Gestionnaire Libre de Parc Informatique
 #
 # http://glpi-project.org
 #
 # @copyright 2015-2025 Teclib' and contributors.
 # @licence   https://www.gnu.org/licenses/gpl-3.0.html
 #
 # ---------------------------------------------------------------------
 #
 # LICENSE
 #
 # This file is part of GLPI.
 #
 # This program is free software: you can redistribute it and/or modify
 # it under the terms of the GNU General Public License as published by
 # the Free Software Foundation, either version 3 of the License, or
 # (at your option) any later version.
 #
 # This program is distributed in the hope that it will be useful,
 # but WITHOUT ANY WARRANTY; without even the implied warranty of
 # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 # GNU General Public License for more details.
 #
 # You should have received a copy of the GNU General Public License
 # along with this program.  If not, see <https://www.gnu.org/licenses/>.
 #
 # ---------------------------------------------------------------------
 #}

<div
    id="{{ id }}"
    class="modal modal-lg modal-blur fade"
    data-testid="illustration-picker-modal"
>
    <div class="modal-dialog rounded">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">{{ __("Illustrations") }}</h5>
                <button
                    type="button"
                    class="btn-close"
                    data-bs-dismiss="modal"
                    aria-label={{ __("Close") }}
                ></button>
            </div>
            <div class="modal-body">
                <div class="input-icon mb-3">
                    <span class="input-icon-addon">
                        <i
                            class="ti ti-search"
                            data-glpi-icon-picker-filter-default-icon
                        ></i>
                        <span class="spinner-border spinner-border d-none" role="status" aria-hidden="true" data-glpi-icon-picker-filter-loading-icon></span>
                    </span>
                    <input
                        type="text"
                        value=""
                        class="form-control"
                        placeholder="{{ __("Search") }}"
                        aria-label="{{ __("Search") }}"
                        data-glpi-icon-picker-filter
                    />
                </div>

                {# The results has its own template file because it can be refreshed directly by some AJAX requests #}
                {{ include('components/illustration/icon_picker_search_results.html.twig', {
                    'filter': '',
                    'page': 1,
                    'page_size': 30,
                }, with_context: false) }}
            </div>
        </div>
    </div>
</div>
